<template>
  <div class="page-box">
    <div class="card-title">基础信息</div>
    <el-form ref="formData" class="form-wrap" size="small" :rules="rules" :model="formData">
      <el-form-item label="评估编号" prop="batch">
        <el-input v-model="formData.batch" placeholder="请输入"></el-input>
      </el-form-item>
      <el-form-item label="评估日期" prop="assessDate">
        <el-date-picker v-model="formData.assessDate" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" @change="dateVerify('assessDate')">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="有效日期" prop="validDate">
        <el-date-picker v-model="formData.validDate" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" @change="dateVerify('validDate')">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="评估机构" prop="assessOrg">
        <el-input v-model="formData.assessOrg" placeholder=""></el-input>
      </el-form-item>
    </el-form>
    <div class="card-title">物业信息<el-button size="small" type="primary" @click="selectRoom">添加物业</el-button></div>
    <room-select ref="roomSelect" @completeSelect="completeSelect" :disabledArr="rentPrices.map(i=>i.roomId)"/>
    <el-row >
      <el-col :span="24">
        <el-table :data="rentPrices" stripe>
          <el-table-column type="index" width="50">
          </el-table-column>
          <el-table-column label="物业名称" prop="propertyName" width="180">
            <template slot-scope="scope">
              <el-input v-model="scope.row.propertyName" :readonly="true"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="projectName" label="所属项目" width="180">
          </el-table-column>
          <el-table-column prop="buildingArea" label="建筑面积" width="180">
          </el-table-column>
          <el-table-column prop="price" label="物业评估价（元/m²/月）" width="180">
            <template slot-scope="scope">
              <el-input v-model="scope.row.price" controls-position="right" v-only-number="{min:0,precision:2}" maxlength="15"/>
            </template>
          </el-table-column>
          <el-table-column width="80" label="操作">
            <template slot-scope="scope">
              <el-link @click.stop="deleteRow(scope.$index)">删除</el-link>
            </template>
          </el-table-column>
          <el-table-column width="10" label="">
            <template slot-scope="scope">
              <el-input type="hidden" v-model="scope.row.roomId"></el-input>
            </template>
          </el-table-column>
        </el-table>
      </el-col>
    </el-row>
    <div class="card-title">其他附件</div>
    <el-row :gutter="20">
      <el-col>
        <p style="font-size: 14px;padding:20px 20px 0px;">评估资料<font color="red">*</font></p>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col>
        <div style="padding: 0 20px">
          <v-upload 
            ref="myUpload" 
            :busId="busId" 
            modelType="rent-price" 
            @onSuccess="onSuccess" 
            @onError="onError"
            v-model="uploadFileList" 
          />
        </div>
      </el-col>
    </el-row>
    <el-row>
      <el-col align="center">
        <el-button @click="goBack">返回</el-button>
        <el-button type="primary" @click="save">保存</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script src="./add.js"></script>
<style scoped lang="scss">
@include formWrap();
.el-row {
  padding: 5px;
}
</style>
